/*

// 1、启动一个webServer
2、JS模块化
3、CSS模块化 （scss）
4、版本号控制
5、代码压缩
// 6、Mock数据



*/


// 暴露
// const connect = require('gulp-connect');
const webpack = require('webpack-stream'); //在nodejs环境中使用require
const sass = require('gulp-sass');
// 根据文件的内容产生一个哈希值（文件编码）
const rev = require('gulp-rev');
const revCollector = require('gulp-rev-collector');
const del = require('del');//删除包
const cleanCSS = require('gulp-clean-css');
const htmlmin = require('gulp-htmlmin');
// const proxy = require('http-proxy-middleware');
const { 
  // 解构
  series,
  // parallel ,
  src,
  dest,
  // watch
} = require("gulp");


// 拷贝html
function copyHtml(){
  // return src('../src/*.html')
  // .pipe(dest('../build'))
  // .pipe(connect.reload())
                   
  return src(['../src/*.html', '../build/rev/**/*.json'])
  .pipe(revCollector())
  .pipe(htmlmin({ collapseWhitespace: true }))
  .pipe(dest('../build'))
  // .pipe(connect.reload())
}
// // 拷贝js          引进webpack-stream后就不需要这个了
// function copyJS(){
//   return src('../src/scripts*.js')
//   .pipe(dest('../scripts/build'))
//   .pipe(connect.reload())
// }




// 启动一个本地的 web server
// function webSever(){
//   return connect.server({
//       host:'localhost',
//       root: '../build',
//       port: 8080,
//       livereload: true,
//       middleware(){
//        return [
//         proxy('/api',{
//           target:"https://m.lagou.com",
//           changeOrigin:true,
//           pathRewrite:{
//             // 替换
//             '^/api':''
//           }
//         })
//       ]
//       }
//     })
  
// }


// JS模块    packJS 打包js

function packJS(){
  return src('../src/scripts/app.js')
  .pipe(webpack(
    {
      // mode:'development',
      mode:'production',
    // 入口出口
      entry:'../src/scripts/app.js',
      output:{
      filename:'app.js'
  },
  module: {
    rules: [
      {
        test: /\.js$/,  //正则   解析.js文件
        exclude: /(node_modules|bower_components)/,   //不包含里面的文件
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['@babel/preset-env'] ,  //@babel/preset-env  预设  翻译各种各样的版本语法
            plugins: ['@babel/plugin-transform-runtime']
          }
        }
      }
    ]
  }
}
  ))
  .pipe(rev())
  .pipe(dest('../build/scripts'))
  .pipe(rev.manifest())  //产生一个新的文件
  .pipe(dest('../build/rev/scripts'))
  // .pipe(connect.reload())
}


// 删除build文件夹
function delDevFolder(){
   return del('../build/**',{
     force:true
   })
}



// CSS模块化

function packCSS(){
  return src('../src/styles/**/*.scss')
  .pipe(sass().on('error', sass.logError))
  .pipe(rev())
  .pipe(cleanCSS({compatibility: 'ie8'}))
  .pipe(dest('../build/styles'))
  .pipe(rev.manifest())  //产生一个新的文件
  .pipe(dest('../build/rev/styles'))
  // .pipe(connect.reload())
}

// 监听
// function watcher(){
//   watch("../src/*.html",series(copyHtml));
//   // watch("../src/scripts/*.js",series(copyJS));
//     watch("../src/scripts/**/*.js",series(packJS));
//     watch("../src/styles/**/*.scss",series(packCSS));
    
// }


  exports.default = series(delDevFolder,packJS,packCSS,copyHtml);
